<!DOCTYPE html>
<html>
<head>
    <#import "../common/common.macro.ftl" as netCommon>
    <@netCommon.commonStyle />
    <!-- DataTables -->
    <link rel="stylesheet" href="${request.contextPath}/static/adminlte/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css">
    <!-- daterangepicker -->
    <link rel="stylesheet" href="${request.contextPath}/static/adminlte/bower_components/bootstrap-daterangepicker/daterangepicker.css">
    <title>${I18n.admin_name}-${I18n.data_center}</title>
</head>
<body class="hold-transition skin-blue sidebar-mini <#if cookieMap?exists && cookieMap["xxljob_adminlte_settings"]?exists && "off" == cookieMap["xxljob_adminlte_settings"].value >sidebar-collapse</#if>">
<div class="wrapper">
    <!-- header -->
    <@netCommon.commonHeader />
    <!-- left -->
    <@netCommon.commonLeft "datacenter" />

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>${I18n.data_center}</h1>
        </section>

        <!-- Main content -->
        <section class="content">
            <input type="hidden" value="" name="filePath"/>
            <div class="row">
                <div class="col-xs-2">
                    <div class="input-group">
                        <span class="input-group-addon">${I18n.dc_dbtype}</span>
                        <select class="form-control" name="dbType" >
                            <option value="1">MYSQL</option>
                            <option value="2">Oracle</option>
                            <option value="4">SQLServer</option>
                        </select>
                    </div>
                </div>
                <div class="col-xs-3">
                    <div class="input-group">
                        <span class="input-group-addon">${I18n.dc_dbinfo}</span>
                        <select class="form-control" name="dbinfo">
                            <#list dbInfos as dbinfo>
                                <option value="${dbinfo.id}">${dbinfo.name}</option>
                            </#list>
                        </select>
                        <span class="input-group-addon" id="searchDbInfoBtn" style="cursor: pointer">
                           ${I18n.system_refresh}
                        </span>
                    </div>
                </div>
                <div class="col-xs-3">
                    <div class="input-group">
                        <span class="input-group-addon">${I18n.dc_tablename}</span>
                        <select class="form-control" name="tablename">
                            <#if tables?exists>
                                <#list tables as table>
                                    <option value="${table.table_name}">${table.table_comment}</option>
                                </#list>
                            </#if>
                        </select>
                        <span class="input-group-addon" id="searchTableNameBtn" style="cursor: pointer">
                            ${I18n.system_refresh}
                        </span>
                    </div>
                </div>
                <div class="col-xs-1">
                    <button class="btn btn-block btn-info" id="searchBtn">${I18n.system_search}</button>
                </div>
                <div class="col-xs-1">
                    <button class="btn btn-block btn-default" id="exportBtn">${I18n.system_export}</button>
                </div>
                <div class="col-xs-1">
                    <button class="btn btn-block btn-default" id="openBtn">${I18n.system_open}</button>
                </div>
                <div class="col-xs-1">
                    <button class="btn btn-block btn-default" id="openDirectoryBtn">${I18n.system_open_directory}</button>
                </div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-body" >
                            <table id="datacenter_list" class="table table-bordered table-striped" width="100%" >
                                <thead>
                                <tr>

                                </tr>
                                </thead>
                                <tbody></tbody>
                                <tfoot></tfoot>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
    </section>
</div>


<!-- footer -->
<@netCommon.commonFooter />
</div>

<@netCommon.commonScript />
<!-- DataTables -->
<script src="${request.contextPath}/static/adminlte/bower_components/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="${request.contextPath}/static/adminlte/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>
<!-- moment -->
<script src="${request.contextPath}/static/adminlte/bower_components/moment/moment.min.js"></script>
<script src="${request.contextPath}/static/adminlte/bower_components/bootstrap-daterangepicker/daterangepicker.js"></script>
<script src="${request.contextPath}/static/js/datacenter.index.1.js"></script>

</body>
</html>
